/*** CSS3 VQS | Chapter 12 | transformation-transition-properties.css ***/

* {
	-webkit-transition: color .25s ease-in, opacity .5s ease, -webkit-transform .25s ease-in-out 0;
	-moz-transition: color .25s ease-in, opacity .5s ease, -moz-transform .25s ease-in-out 0;
	-o-transition: color .25s ease-in, opacity .5s ease, -o-transform .25s ease-in-out 0;
	transition: color .25s ease-in, opacity .5s ease, transform .25 ease-in-out 0; 
}

nav.gallery {
	height: 300px;
}

nav.gallery figure {
	width: auto;
	-webkit-transform-origin: left 25%;
	-moz-transform-origin: left 25%;
	-o-transform-origin: left 25%;
	transform-origin: left 25%;
	-webkit-transform-style: flat;
	transform-style: flat;
	-webkit-perspective: 5000;
	perspective: 5000;
	-webkit-perspective-origin: 25% 25%;
	perspective-origin: 25% 25%;
	-webkit-backface-visibility: visible;
	backface-visibility: visible;
	
  -webkit-animation: slideshow 50s linear infinite;
  -moz-animation:    slideshow 50s linear infinite;
}

#fb:hover, #t:hover, #gp:hover {	
       -webkit-transform: translateY(-40%);
	   -moz-transform: translateY(-40%);
}

.f {
	opacity: .8;
	-webkit-transform: perspective(250) scale3d(.5,.75,1.5) rotate3d(-3,10,-8,18deg);
	-moz-transform:scale(.75) rotate(-8deg);
	-o-transform: scale(.75) rotate(-8deg);
	transform: scale(.75) rotate(-8deg);
}

.f:hover{
	opacity: 1;
	filter: alpha(opacity=100);
	-webkit-transform: rotate(0);
	-moz-transform: rotate(0);
	-o-transform: rotate(0);
	transform: rotate(0);
	cursor: pointer;
	clip: auto;
	z-index: 9999;
}

@-webkit-keyframes slideshow {
    0%   { 
        -webkit-transform: translateX(0);  
    }    
    100% { 
        -webkit-transform: translateX(-535%);  
    }
}
@-moz-keyframes slideshow {
    0%   { 
        -moz-transform:    translateX(0); 
    }    
    100% { 
        -moz-transform:    translateX(-535%); 
    }
}

.noslideshow{
	
-moz-animation-play-state: paused;
-webkit-animation-play-state: paused;
}

#Reserv:hover, #Map:hover, #com:hover{
	-webkit-transform: translateX(-97%);
	   -moz-transform: translateX(-97%);
}